.inner
  h4 Browser Settings

  form(ng-controller="SettingsCtrl")
    div(ng-show="showMessengerButton()")
      h5 Messaging
      .checkbox
        label(for="shouldReportUdc")
          input#shouldReportUdc(type="checkbox", ng-model="settings.shouldReportUdc", ng-change="save()")
          span &nbsp; Share non-sensitive data?
      button.btn.btn-default.btn-sm(ng-click="showMessenger()")
        span.glyphicon.glyphicon-envelope &nbsp;Messenger

    h5 User Interface
    .form-group
      label Theme
      .radio
        label
          input(type="radio", name="themeRadio", id="theme1", value="normal", ng-model="settings.theme", ng-change="save()", checked)
          span(tooltip="Colorful default theme.", tooltip-placement="right") Normal
      .radio
        label
          input(type="radio", name="themeRadio", id="theme2", value="dark", ng-model="settings.theme", ng-change="save()")
          span(tooltip="Low contrast, great in dark surroundings.", tooltip-placement="right") Dark
      .radio
        label
          input(type="radio", name="themeRadio", id="theme3", value="outline", ng-model="settings.theme", ng-change="save()")
          span(tooltip="Higher contrast, great when presenting.", tooltip-placement="right") Outline
    .form-group
      label(for="initCmd", tooltip="This command gets executed when connected.", tooltip-placement="top") Initial Command
        input.form-control.input#initCmd(type='string', ng-model="settings.initCmd", ng-change="save()")

    h5 Preferences
    .checkbox
      label(for="shouldReportUdc")
        input#shouldReportUdcPref(type="checkbox", ng-model="settings.shouldReportUdc", ng-change="save()")
        span &nbsp; Help improve Neo4j?&nbsp;
        a.sl.sl-question-mark(href='http://neo4j.com/legal/neo4j-user-experience/')
    .checkbox
      label(for="experimentalFeatures")
        input#experimentalFeatures(type="checkbox", ng-model="settings.experimentalFeatures", ng-change="save()")
        span(tooltip="Upcoming features that are in beta.", tooltip-placement="top") &nbsp; Enable experimental features?

    .checkbox(ng-show="neo4j.enterpriseEdition")
      label(for="retainConnectionCredentials")
        input#retainConnectionCredentials(type='checkbox', ng-model="settings.retainConnectionCredentials", ng-change="save()")
        span(tooltip="Remember connection credentials in browser.", tooltip-placement="right")
          | &nbsp; Retain login credentials

    .checkbox
      label(for="showSampleScripts")
        input#showSampleScripts(type='checkbox', ng-model="settings.showSampleScripts", ng-change="save()")
        span(tooltip="Show sample scripts in favorites drawer.", tooltip-placement="top")
          | &nbsp; Show sample scripts

    h5 Network Connection
    .checkbox
      label(for="useBolt")
        input#useBolt(type='checkbox', ng-model="settings.useBolt", ng-change="save(); toggleBoltUsage()")
        span(tooltip="Use the Bolt protocol for transport when available.", tooltip-placement="top")
          | &nbsp; Use Bolt protocol when available&nbsp;
          a.sl.sl-question-mark(ng-click='openBoltHelp()')
    .form-group
      label(for="boltHost", tooltip="Set host:port for server Bolt interface.", tooltip-placement="top") Bolt host
        input.form-control.input#initCmd(placeholder="{{defaultBoltHost}}:7687", type='string', ng-model="settings.boltHost", ng-change="save(); updateBoltConnection()")
    .form-group
      label(for="maxExecutionTime", tooltip="Query timeout in seconds.", tooltip-placement="top")
        | Max Execution Time
        input.form-control.input#maxExecutionTime(type='number', min="1", ng-model="settings.maxExecutionTime", ng-change="save()")
    .form-group
      label(for="heartbeat", tooltip="Check connection and update meta data with this interval (in seconds)", tooltip-placement="top")
        | Heartbeat interval
        input.form-control.input#heartbeatInterval(type='number', min="1", ng-model="settings.heartbeat", ng-change="save()")

    h5 Result Frames
    .form-group
      label(for="maxFrames", tooltip="Max number of frames in stream. When reached, old frames gets retired.", tooltip-placement="top")
        | Max Frames
        input.form-control.input#maxFrames(type='number', min="1", ng-model="settings.maxFrames", ng-change="save()")
    .form-group
      label(for="maxHistory", tooltip="Max number of history entries. When reached, old entries gets retired.", tooltip-placement="top") Max History
        input.form-control.input#maxHistory(type='number', min="1", ng-model="settings.maxHistory", ng-change="save()")
    .checkbox
      label(for="scrollToTop")
        input#scrollToTop(type='checkbox', ng-model="settings.scrollToTop", ng-change="save()")
        span(tooltip="Automatically scroll stream to top on new frames.", tooltip-placement="right")
          | &nbsp; Scroll To Top

    h5 Graph Visualization
    .form-group
      label(for="initialNodeDisplay", tooltip="Limit number of nodes displayed on first load of the graph visualization.", tooltip-placement="top")
        | Initial Node Display
        input.form-control.input#initialNodeDisplay(type='number', min="1", ng-model="settings.initialNodeDisplay", ng-change="save()")
    .form-group
      label(for="maxNeighbours", tooltip="Limit exploratary queries to this limit.", tooltip-placement="top")
        | Max Neighbors
        input.form-control.input#maxNeighbours(type='number', min="1", ng-model="settings.maxNeighbours", ng-change="save()")
    .form-group
      label(for="maxRows", tooltip="Max number of rows to render in 'Rows' result view.", tooltip-placement="top")
        | Max Rows
        input.form-control.input#maxRows(type='number', min="1", ng-model="settings.maxRows", ng-change="save()")
    .form-group
      label(for="maxRawSize", tooltip="Limit rendering of raw output to this number of characters.", tooltip-placement="top")
        | Max Raw Size
        input.form-control.input#maxRawSize(type='number', min="1", ng-model="settings.maxRawSize", ng-change="save()")
    .form-group
      label(for="refreshInterval", tooltip="Refresh auto-refreshing frames on this interval (in seconds)", tooltip-placement="top")
        | Refresh Interval
        input.form-control.input#refreshInterval(type='number', min="1", ng-model="settings.refreshInterval", ng-change="save()")
